import PropTypes from 'prop-types'
import { Modal, Radio } from 'antd'
import React from 'react'

const RadioGroup = Radio.Group
const ChooseModal = ({
  customerRes,
  handleOk,
  handleCancle,
  title
}) => {
  let customerChosed = null
  const chooseCustomer = (e) => {
    customerChosed = e.target.value
  }
  const modalOnOk = () => {
    handleOk(customerChosed)
  }
  const modalCancle = () => {
    handleCancle()
  }
  const ChooseModalProps = {
    title: title,
    visible: true,
    onOk: modalOnOk,
    onCancel: modalCancle,
  }
  const radioOptions = customerRes.map((currentValue) => {
    return {
      label: currentValue.firstName + currentValue.middleName + currentValue.lastName,
      value: currentValue.id,
    }
  })
  return (
    <Modal {...ChooseModalProps}>
      <RadioGroup options={radioOptions} onChange={chooseCustomer} />
    </Modal>
  )
}
ChooseModal.PropTypes = {
  customerRes: PropTypes.array,
  handleOk: PropTypes.func,
  handleCancle: PropTypes.func,
}

export default ChooseModal
